const httpApi = ['/epg/addPath', '/epg/editPath', '/epg/removePath'];

layui.use(
  ['layer', 'laydate', 'table', 'form'],
  function (layer, laydate, table, form) {
    // 新增编辑事件
    var layerDIalog = new LayerDialog(layer, form);
    eventArr(layerDIalog);
    window.layer = layer;
    window.table = table;
    window.form = form;
    // 请求列表
    getList(table);

    //工具条事件
    table.on('tool(test)', function (obj) {
      var data = obj.data; // 获得当前行数据
      var layEvent = obj.event; // 获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）

      if (layEvent === 'edit') {
        //查看
        //do somehing
      } else {
        //删除
        layer.confirm('真的删除行么', function (index) {
          LayerDialog.sendRequest('2', '', layer, data.id);
          layer.close(index);
          //向服务端发送删除指令
        });
      }
    });
  },
);

function getList(table) {
  table.render({
    elem: '#demo',
    url: '/epg/getList', //数据接口
    page: true, //开启分页
    cols: [
      [
        //表头
        { align: 'center', field: 'id', title: 'ID', width: 80, hide: true },
        { width: 160, align: 'center', field: 'pathName', title: '入口名称' },
        { align: 'center', field: 'pathAddress', title: '入口地址' },
        { width: 190, align: 'center', field: 'createTime', title: '创建时间' },
        { width: 150, align: 'center', toolbar: '#barDemo', title: '操作' },
      ],
    ],
  });
}

function eventArr(layerDIalog) {
  $.bind($.one('#addPath'), 'click', function () {
    layerDIalog.openLayer('0');
  });
}

function LayerDialog(layer, form) {
  this.form = form;
  this.layer = layer;
}

LayerDialog.prototype.openLayer = function (type) {
  var title;
  var layer = this.layer;
  if (type == '0') {
    title = '新增地址';
  } else if (type == '1') {
    title = '编辑地址';
  } else {
    title = '删除地址';
  }
  layer.open({
    type: '1',
    title: title,
    area: ['600px', '260px'],
    btn: ['确定', '取消'],
    btnAlign: 'c',
    yes: function (index) {
      LayerDialog.sendRequest(type, index, layer);
    },
    content: `
      <div class="layui-form" style="margin: 20px 0;">
        <div class="layui-form-item">
        <label class="layui-form-label">入口名称</label>
          <div class="layui-input-inline" style="width:335px !important;">
            <input type="text" required id="pathName" lay-verify="required" autocomplete="off" class="layui-input">
          </div>
        </div>
        <div class="layui-form-item">
        <label class="layui-form-label">入口地址</label>
        <div class="layui-form-mid layui-word-aux">http://</div>
          <div class="layui-input-inline">
            <input type="text" required id="pathAddress" lay-verify="required" autocomplete="off" class="layui-input">
          </div>
        </div>
      </div>
    `,
    success: function () {
      // layuiForm.render();
    },
  });
};

LayerDialog.sendRequest = function (type, index, layer, id) {
  var pathName;
  var pathAddress;
  var requestUrl = httpApi[type];
  if (type == '0') {
    pathName = $.one('#pathName').value;
    pathAddress = $.one('#pathAddress').value;
    requestUrl =
      requestUrl + '?pathName=' + pathName + '&pathAddress=' + pathAddress;
  } else if (type == '1') {
    pathName = $.one('#pathName').value;
    pathAddress = $.one('#pathAddress').value;
    requestUrl = requestUrl +
      '?pathName=' +
      pathName +
      '&pathAddress=' +
      pathAddress +
      '&id=' +
      id;
  } else {
    requestUrl = requestUrl + '?id=' + id;
  }
  if ((!pathName || !pathAddress) && type !== '2') {
    layer.msg('请输入必填信息', {
      icon: '2',
    });
    return false;
  }
  var load = layer.load(1);
  $.bytueAjaxJspGet(requestUrl, function (result) {
    var objResult = JSON.parse(result);
    layer.close(load);
    if (objResult.code == '0') {
      layer.close(index);
      getList(window.table);
    }
    layer.msg(objResult.message);
  });
};
